<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!-- 
<table id="grid"
	dojoType="dojox.grid.DataGrid"
	store = "icStore"
	clientSort="true"
	style="width: 35em;height: 15em;"
> 
<colgroup span="1" noscroll="true" ></colgroup>
<colgroup span="4"></colgroup>
<thead>
	<tr>
		<th field="name">Flavor</th>
		<th field="mix">mix</th>
		<th field="fat">Fat</th>
	</tr>
</thead>
</table>

<span dojoType="dojo.data.ItemFileReadStore"
	jsId = "icStore" 
	url = "portal/part/grid.json"
> 
</span>
<table data-dojo-type="dojox.grid.DataGrid" 
data-dojo-props="store:icStore" 
style="width: 800px; height: 300px;">
  <thead>
    <tr>
      <th field="name" cellType="dojox.grid.cells.Select" options="country,city,continent"
            editable="true" width="200px">name</th>
      <th field="fat" width="200px">fat</th>
      <th field="mix" >mix</th>
    </tr>
  </thead>
</table>
 -->





<span dojoType="dojo.data.ItemFileWriteStore" jsId="wishStore" url="portal/part/grid.json">
</span>

<table editable="true"  id="gridx" 
dojoType="dojox.grid.EnhancedGrid" store="wishStore"
query="{ description: '*' }" clientSort="true"

data-dojo-props="plugins:{ filter: {closeFilterbarButton: true,ruleCount: 5, itemsName: 'songs' },indirectSelection: {
            	headerSelector:true, 
            	width:'40px', 
            	styles:'text-align: center;'
},pagination: {
              pageSizes: ['25', '50', '100', 'All'],
              description: true,
              sizeSwitch: true,
              pageStepper: true,
              gotoButton: true,
              maxPageStep: 4,
              position: 'bottom'
            }}"

 >
<script type="dojo/connect" event="onRowClick" args="evt" >
	var des = this.store._arrayOfTopLevelItems[evt.rowIndex].description;
	var size = this.store._arrayOfTopLevelItems[evt.rowIndex].size;
	var origin = this.store._arrayOfTopLevelItems[evt.rowIndex].origin;
	var wrapper = this.store._arrayOfTopLevelItems[evt.rowIndex].wrapper;
	var shape = this.store._arrayOfTopLevelItems[evt.rowIndex].shape;
	// alert(des);
</script>
<thead>
<tr>

<th field="description"  width="252px" >Cigar</th>
<th field="size"  editable="true">Length/Ring</th>
<th field="origin" >Origin</th>
<th field="wrapper" >Wrapper</th>
<th field="shape" >Shape</th>
</tr>
</thead>
</table> 





